/* CSS Document */

/*
Projekt:              Házená Náchod
Datum relizace:       9/2010
Relizator:            Tomáš Bdínka | WEBCook.cz
WWW:                  http://www.webcook.cz

OBSAH
*******************************************************************************
  
  1)    Obecne definice
  
  2)    Rozlozeni stranky
  2.1)  Nadpisy
  2.2)  Odkazy
  2.3)  Obrazky
  
  3)    Hlavicka webu
  3.1)  Logo + slogan
  3.2)  Slogan nebo jine info
  3.2)  Horizontalni menu (hlavni navigace)
  3.3)  Prihlasovaci a jine boxy
  
  4)    Obsahova cast
  4.1)  Rozlozeni obsahu
  4.2)  Leva cast
  4.3)  Prava cast
  4.4)  Specifika pro obsahovou cast
  
  5)    Doplnky webu (formulare, tabulky, zvlastni odkazy)
  
  6)    Paticka webu
  
*******************************************************************************
*/

/*
  1)    Obecne definice
*/

body {
  background: url(../images/web/bg.jpg) no-repeat center top fixed #041b31;
  text-align: center;
  margin: 0px;
  padding: 0px;
  font-family: Arial, Tahoma, sans-serif;
  font-size: 12px;
}

body * {
  text-align: left;
}

.float-l {
  float: left;
}

.float-r {
  float: right;
}

.clear-b {
  display: block;
  height: 1px;
  width: 100%;
  clear: both;
}

.orange {
  color: #f08925;
}

.brown {
  color: #56473a;
}

#content h3 {
  font-size: 180%;
  margin-top: 20px;
  margin-bottom: 5px;
}

.bigger {
  font-size: 120%;
}


/*
  2)    Rozlozeni stranky
*/

#page {
  width: 980px;
  margin: 0px auto;
}

#contentWrap {
  background-color: #fff;
  
}

#contentWrap #content {
  background-color: #fff;
  padding: 20px;
}

/*
  3)    Hlavicka webu
  3.1}  Logo + slogan
*/
#page #header {
  position: relative;
  height: 216px;
}

#page #header #topNavigation {
  height: 26px; /*42-16*/
  padding: 8px;
  position: relative;
}

#page #header #topNavigation strong {
  color: #fff;
  margin-right: 198px;
}

#topNavigation #submitBtLogin {
  background: url(../images/web/submitBtLogin.jpg) no-repeat left top;
  border: 0 none;
  cursor: pointer;
  text-indent: -999px;
  width: 74px;
  height: 20px;
}

#page #header #logotype {
  display: block;
  width: 476px;
  height: 105px;
  overflow: hidden;
  position: relative;
  font-size: 250%;
  color: #fff;
  line-height: 105px;
  margin: 15px auto 15px 30px;
}

#page #header #logotype span {
  background: url(../images/web/logotype.jpg) no-repeat left top;
  cursor: pointer;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
}

#page #header .playerWrap {
  position: absolute;
  right: -42px;
  top: 0px;
  overflow: hidden;
  display: block;
  width: 196px;
  height: 262px;
  background: url(../images/web/playerTop.png) no-repeat left top;
}

#page #header .playerWrap a#registration {
  float: right;
  text-transform: uppercase;
  color: #f08925;
  z-index: 1000;
  text-decoration: none;
  border-bottom: 1px dotted #f08925;
  margin-right: 50px;
  margin-top: 8px;
}

#page #header .playerWrap a#registration:hover {
  border-bottom-color: #fff
}

#page #header #playerTop {
  display: block;
  width: 196px;
  height: 262px;
  background: url(../images/web/playerTop.png) no-repeat left top;
  z-index: 0;
  overflow: hidden;
  /*
  float: right;
  margin: -191px -42px;
  display: block;
  width: 196px;
  height: 262px;
  background: url(../images/web/playerTop.png) no-repeat left top;
  overflow: hidden;
  */
}

/*
  3.2)  Horizontalni menu (hlavni navigace)
*/

#header #menu {
  height: 39px;
  position: relative;
  z-index: 1001;
}

#header #menu ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#header #menu ul li, #header #menu ul li a {
  float: left;
}

#header #menu ul li a {
  display: block;
  padding: 0px 10px;
  height: 39px;
  line-height: 39px;
  text-transform: uppercase;
  text-decoration: none;
  color: #fff;
  background: url(../images/web/menuBgActive.png) repeat-x left top;
  margin-right: 3px;
}

#header #menu ul li a:hover {
  background: url(../images/web/menuBgHover.png) repeat-x left top;
}

#header #menu ul li.selected a {
  background: none;
  background-color: #fff;
  color: #141861;
}

/*
  4)    Obsahova cast
*/

/*
  4.1)  Rozlozeni obsahu
*/

#content #contentLeft {
  width: 233px;
  float: left;
  margin-top: 20px;
}

#content #contentCenter {
  width: 504px;
  float: left;
  margin: 20px 20px;
}

#content #contentRight {
  width: 163px;
  float: right;
  margin-top: 20px;
}

#content #contentLeft .box {
  position: relative;
  color: #fff;
  padding: 10px;
  background: #174894 url(../images/web/boxBgTop.jpg) no-repeat left top;
}

#content #contentLeft .box .boxBottom {
  width: 100%;
  height: 6px;
  margin: 0px;
  padding: 0px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background: url(../images/web/boxBg.jpg) no-repeat left bottom;
  overflow: hidden;
  z-index: 111;
}

#content #contentLeft .box h2, #partner h2 {
  font-size: 145%;
  color: #fff;
  margin: 2px auto 10px auto;
  padding: 0px;
  text-shadow: 1px 1px 1px #000;
}

#content #contentLeft .box table th strong {
  text-transform: uppercase;
  color: #f08925;
}

#content #contentLeft .box table th.mainCell {
  width: 200px;
  padding: 5px 0px;
}

#content #contentLeft .box .more, #content #contentRight .smallBox .more { 
  display: block;
  padding: 6px 10px 0px 6px;
  border-top: 1px dotted #fff;
  text-decoration: none;
  text-align: right;
  color: #fff;
  margin: 10px -10px auto -10px;
}

#content #contentLeft .box .more:hover, #content #contentRight .smallBox .more:hover {
  color: #f08925
}

/* partneri */
#content #contentRight #partner {
  position: relative;
  color: #fff;
  padding: 10px;
  background: #b8b1aa url(../images/web/partnerBgTop.jpg) no-repeat left top;
  margin-top: 20px;
}

#content #contentRight #partner .boxBottom {
  width: 100%;
  height: 6px;
  margin: 0px;
  padding: 0px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background: url(../images/web/partnerBg.png) no-repeat left bottom;
  overflow: hidden;
  z-index: 111;
}

#content #contentRight #partner .partnerItem {
  padding-top: 10px;
}

#content #contentRight #partner .partnerItem a {
  font-size: 80%;
  color: #fff;
}

#content #contentRight #partner .partnerItem a:hover {
  text-decoration: none;
}

/* dalsi zapas */
#content #contentRight #nextGame .rival {
  display: block;
  font-weight: bold;
  margin-top: 40px;
  font-size: 140%;
  padding: 20px 0px 15px;
  text-align: center;  
}

#content #contentRight #nextGame .when {
  display: block;
  margin-top: 10px;
  padding-left: 5px;
  height: 50px;
  font-size: 120%;
}

#content #contentRight .smallBox {
  position: relative;
  color: #fff;
  padding: 10px;
  background: #174894 url(../images/web/smallBoxBg.png) no-repeat left top;
}

#content #contentRight .smallBox .boxBottom {
  width: 100%;
  height: 6px;
  margin: 0px;
  padding: 0px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background: url(../images/web/smallBoxBg.png) no-repeat left bottom;
  overflow: hidden;
  z-index: 111;
}

#content #contentRight .smallBox h2 {
  font-size: 140%;
  color: #fff;
  margin: 2px auto 10px auto;
  padding: 0px;
  text-shadow: 1px 1px 1px #000;
}

#content #contentRight .smallBox .more {
  border: 0 none;
  margin: 0px;
}


/*
  4.1.1)  Novinky
*/
#contentCenter .new {
  margin-top: 10px;
  width: 48%;
  padding: 0px 10px 10px 0px;
  float: left;
}

#contentCenter .new img {
  float: left;
  margin-right: 5px;
  border: 3px solid #a8a8a8;
}

#contentCenter .new .date {
  color: #0a3880;
  font-size: 80%;
  font-weight: bold;
  display: block;
  float: none;
  margin-bottom: 5px;
}

#contentCenter .new a {
  background-color: #0a3880;
  color: #fff;
  padding: 2px;
  margin-bottom: 5px;
  text-decoration: none;
  display: block;
}

#contentCenter .new a:hover {
  background-color: #f08925;
  color: #fff;
}

#contentCenter .new a.more {
  display: inline;
  background: none;
  color: #f08925;
  border-bottom: 1px dotted #f08925;
  text-decoration: none;
  padding: 5px 0px 0px;
  font-weight: bold;
}

#contentCenter .new a.more:hover {
  border-color: #0a3880;
}

#content #news {
  height: 252px;
  width: 940px;
  position: relative;
  z-index: 0;
}

#content #news img {
  position: absolute;
}

#content #news h1 {
  position: absolute;
  z-index: 1000;
  color: #fff;
  padding: 10px 15px;
  margin-top: 0px;
  text-align: left;
  font-size: 180%;
  margin-left: 0px;
  float: left;
}

#content #news #newsHandle {
  margin: 0px;
  padding: 0px;
  width: 560px;
  list-style: none;
}

#content #news #newsHandle li {
  position: relative;
  height: 84px;
  margin: 0px;
  padding: 0px;
  background: #0a3880 url(../images/web/newsSeparator.png) no-repeat center bottom;
}

#content #news #newsHandle li:hover, #content #news #newsHandle li.selected {
  background: #1c56b0 url(../images/web/newsSeparator.png) no-repeat center bottom;
}

#content #news #newsHandle li a {
  padding: 10px 14px 5px 14px;
  display: block;
  color: #fff;
  font-size: 110%;
  font-weight: bold;
}

#content #news #newsHandle li a:hover {
  color: #F08925;
}

#content #news #newsHandle li span {
  color: #b0cdfa;
  padding: 0px 14px;
  display: block;
  font-size: 90%;
}

#content #news #newsHandle p {
  padding: 0px 14px 10px 14px;
  display: block;
  color: #fff;
  text-decoration: none;
  font-size: 110%;
}

/*
  4.1.2)  Dotaznik {anketa}
*/

#content #questions {
  width: 299px; /*337 - 36*/
  height: 216px; /*252 - 36*/
  padding: 18px;
  background: url(../images/web/questionsBg.jpg) no-repeat left top;
}

#content #questions h2 {
  color: #fff;
  padding: 10px 14px;
  margin: -18px auto 8px -18px;
  font-size: 140%;
}

#content #questions strong {
  display: block;
  border-bottom: 1px dotted white;
  padding-bottom: 10px;
  font-weight: normal;
  font-style: italic;
  font-size: 110%;
  margin-bottom: 10px;
}

#content #questions a {
  color: #000;
  text-decoration: none;
  font-weight: bold;
  clear: both;
  display: block;
  margin-top: 8px;
}

#content #questions a:hover {
  color: #0a3880;
}

#content #questions .questionsPercentage {
  width: 275px;
}

#content #questions .questionsPercentage .quesionsPercentageBg {
  display: block;
  height: 8px;
  background-color: #F08925;
  float: left;   
  margin-top: 4px;
}

#content #questions .questionsPercentage .questionsPercentageAmount {
  margin-right: -30px;
  width: 30px;
  text-align: right;
  float: right;
} 
 
/*
  4.3)  Dalsi veci na uvodni strance
*/

#contentCenter h2 {
  font-size: 200%;
  margin-top: 0px;
  margin-bottom: 10px;
}

#wantPlay {
  display: block;
  position: relative;
  overflow: hidden;
  width: 233px;
  height: 100px;
  cursor: pointer;
  margin: 20px 0px;
}

#wantPlay span {
  position: absolute;
  left: 0px;
  top: 0px;
  display: block;
  height: 100%;
  width: 100%;
  background: url(../images/web/wantPlay.png) no-repeat left top;
}

#wantPlay:hover span {
  background-position: left bottom;
}

#fb {
  display: block;
  position: relative;
  overflow: hidden;
  width: 162px;
  height: 46px;
  cursor: pointer;
  margin-top: 20px;
}

#fb span {
  position: absolute;
  left: 0px;
  top: 0px;
  display: block;
  height: 100%;
  width: 100%;
  background: url(../images/web/fb.png) no-repeat left top;
}

#fb:hover span {
  background-position: left bottom;
}

/* fotogalerie */
#contentCenter #photogallery {
  background: url(../images/web/fotogalleryBg.png) no-repeat left top;
  width: 475px;
  height: 139px;
  padding: 10px 15px;
  margin-top: 20px;
}  

#contentCenter #photogallery .wrap {
  padding-left: 47px;
  position: relative;
}  

#contentCenter #photogallery .wrap .handleLeft {
  display: block;
  width: 26px;
  height: 26px;
  background: url(../images/web/fotoHandleLeft.png) no-repeat left top;
  cursor: pointer;
  position: absolute;
  left: 0px;
  top: 23px;
}

#contentCenter #photogallery .wrap .handleLeft:hover, #contentCenter #photogallery .wrap .handleRight:hover {
  background-position: right top;
}

#contentCenter #photogallery .wrap .handleRight {
  display: block;
  width: 26px;
  height: 26px;
  cursor: pointer;
  position: absolute;
  background: url(../images/web/fotoHandleRight.png) no-repeat left top;
  right: 0px;
  top: 23px;
}
 

#contentCenter #photogallery h3 {
  color:#FFFFFF;
  font-size:150%;
  margin:2px auto 10px;
  padding:0;
  text-shadow:1px 1px 1px #000000;
  text-transform: uppercase;
} 

#contentCenter #photogallery a {
  margin-right: 10px;
}

#contentCenter #photogallery a img {
  padding: 0px;
  margin: 0px;
  border: 3px solid #a8a8a8;
}

#contentCenter #photogallery a:hover img {
  border-color: #fff;
}
             
/*
  6)    Paticka webu
*/

#footer {
  position: relative;
  height: 80px;
  background: #1d1d1d;
  margin-bottom: 20px;
}

#footer #playerBottom {
  display: block;
  position: absolute;
  left: -385px;
  bottom: -20px;
  background: url(../images/web/playerBottom.png) no-repeat left bottom;
  width: 385px;
  height: 566px;
}

#footer #playerBottom span {
  display: none;
}

#footer .footerSymbol {
  display: block;
  width: 101px;
  height: 88px;
  position: absolute;
  left: 440px;
  top: -25px;
  background: url(../images/web/footerBg.jpg) no-repeat left bottom;
}

#footer p {
  line-height: 80px;
  font-weight: bold;
  color: #fff;
  margin: 0px;
  padding: 0px 20px;
}  

#footer a {
  color: #85b1f6;
}

#footer a:hover {
  text-decoration: none;
}

#content .navigation {
  /*background-color: #333333;*/
  margin: -20px -20px 0px -20px;
  display: block;
  padding: 10px;
  color: #000 !important;
  height: 17px;
}

#content .navigation a {
  color: #787878 !important; 
  float: left;
}

#content .navigation span.delic {
  float: left;
  display: block;
  width: 15px;
  height: 100%;
  background: url(../images/web/delic.gif) no-repeat center center;
}

#info-error {
	border: 1px solid red;
	padding: 5px;
	font-variant: inherit;
	font-size: 16px;
	font-family: sans-serif;
}

#info-ok {
	border: 1px solid green;
	padding: 5px;
	font-variant: inherit;
	font-size: 16px;
	font-family: sans-serif;
}

#info-info {
	border: 1px solid orange;
	padding: 5px;
	font-variant: inherit;
	font-size: 16px;
	font-family: sans-serif;
}